@import './layout.scss';

//按钮的抽象：
@mixin btn($size:14px,$color:#fff,$bgc:#f04752,$padding:5px,$radius:5px){
    padding:$padding;
    background-color:$bgc;
    border-radius:$radius;
    color:$color;
    border:1px solid $bgc;
    font-size: $size;
    text-align: center;
    line-height:1;
    display: inline-block
}

//列表的抽象：可配横向和纵向
@mixin list($direciton:column){
    @include flex($direciton)
}

//面板的抽象：
@mixin panel($bgc:#fff,$padding:0,$margin:20px 0,$height:112px,$txtPadding:0 32px,$color:#333,$fontSize:32px){
    background-color: $bgc;
    padding:$padding;
    margin: $margin;
    >h4{
        height: $height;
        line-height: $height;
        padding:$txtPadding;
        color:$color;
        font-size: $fontSize;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
    
}